<script setup lang="tsx">
import { computed, nextTick, ref } from 'vue';
import dayjs from 'dayjs';
import useSearchData from '@/hooks/common/searchData';
import Search from './modules/search.vue';

const searchParams = ref({
  equipmentId: null,
  alarmText: null,
  time: null
});

const columnChecks = ref<any[]>([
  {
    key: 'index',
    dataIndex: 'index',
    title: '序号',
    width: 70,
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'mainEqpId',
    dataIndex: 'mainEqpId',
    title: '线体代码',
    width: 140,
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'mainEqpName',
    dataIndex: 'mainEqpName',
    title: '线体名称',
    width: 160,
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'subEqpId',
    dataIndex: 'subEqpId',
    title: '设备',
    width: 160,
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'subEqpName',
    dataIndex: 'subEqpName',
    title: '设备名称',
    width: 160,
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'dateTime',
    dataIndex: 'dateTime',
    title: '建立时间',
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'alarmId',
    dataIndex: 'alarmId',
    title: '警报代码',
    align: 'center',
    checked: true,
    width: 100,
    ellipsis: true
  },
  {
    key: 'alarmCategory',
    dataIndex: 'alarmCategory',
    title: '警报类型',
    align: 'center',
    width: 100,
    checked: true,
    ellipsis: true
  },
  {
    key: 'alarmText',
    dataIndex: 'alarmText',
    title: '警报内容',
    align: 'center',
    width: 200,
    checked: true,
    ellipsis: true
  },
  {
    key: 'startTime',
    dataIndex: 'startTime',
    title: '开始时间',
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'endTime',
    dataIndex: 'endTime',
    title: '结束时间',
    align: 'center',
    checked: true,
    ellipsis: true
  }
]);

const tableRef = ref<any>();

const searchData = useSearchData(searchParams);

function reset() {
  searchParams.value = {
    equipmentId: null,
    alarmText: null,
    time: null
  };
  nextTick(() => {
    search();
  });
}

function search() {
  tableRef.value.getData(1);
}
</script>

<template>
  <div class="jl-main-page one-code-ascend min-h-500px flex-col-stretch gap-16px overflow-hidden lt-sm:overflow-auto">
    <Search v-model:model="searchParams" @reset="reset" @search="search" />
    <Table
      ref="tableRef"
      v-model:searchParams="searchData"
      :column="columnChecks"
      :auto-generate-uuid="true"
      :show-row-selection="false"
      url="/mes/equipment-alarm-info/pressList"
      class="h-full"
    />
  </div>
</template>

<style></style>
